<template>
  <div>
    <el-dialog
      ref="batchDialog"
      title="批量发起合同"
      :visible="popVisible"
      :close-on-click-modal="false"
      @close="onCancel"
      top="6vh"
    >
      <contractCreate ref="createWorkerRef" :templateType="2" :templateList="templateList" :workerList="list" :close="onCancel"></contractCreate>
    </el-dialog>
  </div>
</template>
<script>
import { mapGetters } from 'vuex';
import { getTemplateList } from '@common/api/template';
import contractCreate from '../../components/contractCreate';

export default {
  props: {
    visible: {
      type: Boolean,
      default() {
        return false;
      },
    },
    list: {
      type: Array,
      default() {
        return [];
      },
    },
  },
  components: {
    contractCreate,
  },
  data() {
    return {
      loading: true,
      templateList: [],
    };
  },
  computed: {
    ...mapGetters(['orgname']),
    popVisible() {
      return this.visible;
    },
    hasTemplate() {
      return !this.loading && !this.templateList?.length;
    },
  },
  watch: {
    popVisible() {
      if (this.popVisible) {
        this.fetchTpls();
      } else {
        this.$refs?.createWorkerRef?.resetCreate(); // 重置数据
      }
    },
  },

  methods: {
    async fetchTpls() {
      const res = await getTemplateList({
        withPreviewUrl: false, // 是否获取模板预览链接
        tenantTemplateType: 2, // 劳务合同
      });
      if (res?.data?.Templates?.length) {
        this.templateList = res.data.Templates;
        this.loading = false;
      } else {
        this.templateList = [];
        this.loading = false;
      }
    },
    onCancel() {
      this.$emit('batchHide');
      this.$refs.createWorkerRef.resetCreate();
    },
  },
};
</script>
